<!doctype html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-4.dtd">
<html xmlns:th="http://www.thymeleaf.org">
<body>
	<section class="content-header">
		<h1>
			部门 <small>部门列表</small>
		</h1>
		<ol class="breadcrumb">
			<li>
				<a th:href="@{/dashboard}"><i class="fa fa-dashboard"></i> 首页</a>
			</li>
			<li>
				<a href="javascript:;">用户管理</a>
			</li>
			<li class="active">部门列表</li>
		</ol>
	</section>

	<section class="content">

		<div class="mailbox-controls">
			<div class="btn-group btn-group-sm">
				<a class="btn btn-primary" href="#/page/department/add"> <i class="fa fa-plus"></i> 添加
				</a>
			</div>
		</div>

		<div class="box box-primary">
			<div class="box-body no-padding">
				<table id="grid-department" class="table table-hover">
					<thead>
						<tr>
							<th>名称</th>
							<th class="hidden-xs">电话</th>
							<th class="hidden-xs hidden-sm">排序号</th>
							<th class="command-column" style="width: 120px;">操作</th>
						</tr>
					</thead>
					<tbody>
						<tr th:each="department: ${departments}" th:class="'treegrid-'+${department.id}"
							th:classappend="${department.parent==null}?'':('treegrid-parent-'+${department.parent.id})">
							<td th:text="${department.name}">name</td>
							<td class="hidden-xs" th:text="${department.phone}">phone</td>
							<td class="hidden-xs hidden-sm" th:text="${department.sortNo}">sortNo</td>
							<td>
								<div class="btn-group btn-group-sm" th:data-row-id="${department.id}">
									<a class="btn btn-primary" th:href="'#/page/department/add/'+${department.id}"> <i
										class="fa fa-plus"></i>
									</a>
									<a class="btn btn-primary" th:href="'#/page/department/edit/'+${department.id}"> <i
										class="glyphicon glyphicon-edit"></i>
									</a> <a aria-expanded="false" aria-haspopup="true" data-toggle="dropdown" class="btn btn-primary dropdown-toggle"
										type="button"> <i class="fa fa-cog"></i> <span class="ion-arrow-down-b"></span>
									</a>
									<ul class="dropdown-menu pull-right">
										<li>
											<a href="javascript:;" class="command-delete"><i class="glyphicon glyphicon-remove"></i> 移除</a>
										</li>
									</ul>
								</div>
							</td>
						</tr>
					</tbody>
				</table>
			</div>
		</div>

	</section>


	<script type="text/javascript">
		requirejs([ "domReady", "treegrid" ], function(ready) {
			ready(function() {
				activeMenu("system_department");
				$("#grid-department").treegrid();
			});
		});
	</script>
</body>
</html>

